<template>
    <van-nav-bar title="用户注册" left-text="返回" left-arrow @click-left="onClickLeft" />
    <div id="box">
        <div class="v-photo">
            <van-image src="https://img.zcool.cn/community/01f8b6593a0054a8012193a31c86c5.jpg@2o.jpg" />
        </div>
      <!-- 上传图片 -->
      <van-field name="uploader" label="文件上传">
  <template #input>
    <van-uploader v-model="value" />
  </template>
</van-field>
        <!-- 注册账号密码 -->
        <van-form @submit="onSubmit">
            <van-cell-group inset>
                <van-field v-model="username" name="账号" required label="账号" placeholder="账号"
                    :rules="[{ required: true, message: '请填写账号' }]" />
                <van-field v-model="password" type="password" name="密码" required label="密码" placeholder="密码"
                    :rules="[{ required: true, message: '请填写密码' }]" />
                <van-field v-model="nick" name="昵称" label="昵称" placeholder="昵称"
                    :rules="[{ required: true, message: '请填写昵称' }]" />
            </van-cell-group>
            <div style="margin: 16px;">
                <van-button round block type="primary" native-type="submit">
                    注册账号
                </van-button>
            </div>
        </van-form>
    </div>
</template>

<script setup lang="ts">
import { ref, type Ref } from 'vue'
import { RequestAddGoods } from '@/api/index'
import { Toast } from 'vant'
import { useRouter } from 'vue-router'


const router = useRouter()

// 返回上一页
const onClickLeft = () => history.back()
//账号密码昵称
const username: Ref<string> = ref('')
const nick: Ref<string> = ref('')
const password: Ref<string> = ref('')
// const headerimg: Ref<string> = ref('')

    


//注册账号
const onSubmit = async () => {
    const data = await RequestAddGoods(username.value, password.value, nick.value )
    const { resultCode, resultInfo } = data
    if (resultCode === 1) {

        Toast.success('注册成功！')
        router.replace('/phone')
        

    } else {
        Toast.fail('注册失败再试一次')
    }

}
const value = ref([
      { url: 'https://fastly.jsdelivr.net/npm/@vant/assets/leaf.jpeg' },
    ]);








</script>

<style lang="scss" scoped>
#box1 {
    width: 100%;
    height: 100%;

}
</style> 

